﻿@{
    Layout = "~/Views/Shared/_FormGray.cshtml";
}

@inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment HostingEnvironment
@section header{
    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/fileinput/5.0.3/css/fileinput.min.css"))
    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/fileinput/5.0.3/js/fileinput.min.js"))
}

<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>文件上传控件 <small>https://github.com/kartik-v/bootstrap-fileinput</small></h5>
                </div>
                <div class="ibox-content">
                    <div class="form-group">
                        <label class="font-noraml">简单示例</label>
                        <div class="file-loading">
                            <input id="fileinput-demo-1" type="file">
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="font-noraml">多文件上传</label>
                        <div class="file-loading">
                            <input id="fileinput-demo-2" type="file" multiple>
                        </div>
                    </div>
                        <div class="form-group">
                        <label class="font-noraml">多文件上传-自写实例</label>
                        <div class="file-loading">
                            <input id="fileinput-demo-3" type="file" multiple>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
    $(document).ready(function () {
        $("#fileinput-demo-1").fileinput({
            language: 'zh',
            'uploadUrl': '@GlobalContext.SystemConfig.ApiSite' + '/File/UploadFile?fileModule=@UploadFileType.News.ParseToInt()',
            showPreview: false
        });

        $("#fileinput-demo-2").fileinput({
            language: 'zh',
            'uploadUrl': '@GlobalContext.SystemConfig.ApiSite' + '/File/UploadFile?fileModule=@UploadFileType.News.ParseToInt()',
            overwriteInitial: false,
            initialPreviewAsData: true,
            initialPreview: ['@Url.Content("~/image/portrait.png")']
        });



       var picList =  [
            						{type: "image", caption: "Image-1.jpg",  url:'@GlobalContext.SystemConfig.ApiSite'+"/Resource/News/2022/09/06/e586b9df610f4a1882e64da3d4ca62ab.png", key: 1},
            						{type: "image", caption: "Image-2.jpg", url: '@GlobalContext.SystemConfig.ApiSite'+"/Resource/News/2022/09/06/e586b9df610f4a1882e64da3d4ca62ab.png", key: '1519713821098wwp4h8v'} // set as raw markup
            					];
       //var modeId = [[${modeId}]];
         
        var initialPreview = [] ;
        var initialPreviewConfig = [] ;
        for (var i = 0; i < picList.length; i++) {

                initialPreview.push(picList[i].url) ;
                initialPreviewConfig.push(generFilDel(picList[i])) ;
            }
        
 
        function generFilDel(file) {
 
			if(file.type=='pdf'){
				return 	{type: "pdf", size: "102434", caption: file.name, url:'@GlobalContext.SystemConfig.ApiSite' + '/File/DeleteFile?fileModule=@UploadFileType.News.ParseToInt()', key: file.key, downloadUrl:file.url};
			}else if(file.type=='text'){
				return {caption: file.caption, type: "text", size:  "23405", url:'@GlobalContext.SystemConfig.ApiSite' + '/File/DeleteFile?fileModule=@UploadFileType.News.ParseToInt()', key: file.key , downloadUrl:file.url};
			}else if(file.type=='mp4'){
				return  {type: "video", size: file.size, filetype: "video/mp4", caption: file.name, url:'@GlobalContext.SystemConfig.ApiSite' + '/File/DeleteFile?fileModule=@UploadFileType.News.ParseToInt()', key: file.key , downloadUrl:file.url};
			}else{
				return	{caption: file.caption, size:  "23405", url:'@GlobalContext.SystemConfig.ApiSite' + '/File/DeleteFile?fileModule=@UploadFileType.News.ParseToInt()', key: file.key};
			}
        }
        
        $("#fileinput-demo-3").fileinput({
             language: 'zh',
            uploadUrl: '@GlobalContext.SystemConfig.ApiSite' + '/File/UploadFile?fileModule=@UploadFileType.News.ParseToInt()',
            maxFileCount: 5,
            autoReplace: true,
            showClose: false, //隐藏右上角叉
            showRemove: false, //隐藏清除按钮
            //uploadExtraData: { modeId:modeId },
        	initialPreview: initialPreview,
         	initialPreviewConfig: initialPreviewConfig,
			initialPreviewAsData: true, // defaults markup
            fileSizeGetter:true,
            overwriteInitial:false
        
         }).on('fileuploaded', function (event, data, previewId, index) {
        	 // 文件上传完成
            picList.push({'key':data.response.data.id,'url':data.response.data.url});
        	 
        }).on('filesuccessremove', function (event, data, previewId, index) {
        	// 上传完成后, 移除成功通知
			for (var i = 0; i < picList.length; i++) { 
			      if (picList[i].name== data) { 
 			          picList[i]; 
			      } 
			   }                 	
         }).on('filedeleted', function (event, key) {
        	 var ss=key;
             var ssd=data;
         })
    });
</script>